<html>
	<head>
		<title>TA Application - Advanced Search</title>
		<script type="text/javascript">
			function changeSearch(){
				
				var searchDiv = document.getElementById('search');
				
				var searchTypes = document.getElementsByName('searchType');
				
				if(searchTypes[0].checked)
					searchType = 0;
				else if(searchTypes[1].checked)
					searchType = 1;
				
				switch(searchType){
					case 0:
						searchDiv.innerHTML = '<br /> \
											Major Field: {{ field }} \
											<br /> \
											Native English: {{ nativeEnglish }} \
											<br /> \
											Specialization: {{specialization}} \
											<br /> \
											Qualified: {{ qualifications }}\
											<br /> \
											Previously TA\'ed: {{ previouslyAssigned }} \
											<br /> \
											Programming Languages: {{ languages }}';
					break;
					
					case 1:
						searchDiv.innerHTML = '<br/> \
										TAs needed: <input name="numTAs" type="text" value="{{ numTas }}" /> \
										<br /> \
										Course Name: {{ assigned }} \
										<br /> \
										Taught By: {{ profs }}';
						
					break;
				}
			}
		</script>
	</head>
	<body onLoad="changeSearch()">
		<form name = "advSearch" method="POST" action = "/admin/advSearch">
			Search for:
			<br />
			
			{% ifequal searchType "ta" %}
			    <input type="radio" onClick="this.form.submit()" name="searchType" onSelect="changeSearch()" value="ta" checked />TA
			    <input type="radio" onClick="this.form.submit()" name="searchType" value="class" />Class
			{% else %}
			    <input type="radio" onClick="this.form.submit()" name="searchType" onSelect="changeSearch()" value="ta" />TA
			    <input type="radio" onClick="this.form.submit()" name="searchType" value="class" checked />Class
			{% endifequal %}
			<div id = "search">
			</div>
			
	    
			Semester: {{ semesters }}
			<br />
			<input type="submit" value="Search" />
		</form>
		<style>
			#results{
				font-size: 12px;
			}
			#result{
				float: left;
				padding: 10px 10px 10px 10px;
				margin: 10px 5px 0px 0px;
				border: 2px solid;
			}
			#name{
				float: left;
				width: 100%;
				font-size: 16px;
				font-wdight: bold;
				padding: 0px;
				margin: 0px;
			}
			#basicInfo{
				float: left;
				padding: 0px 0px 0px 12px;
			}
			.multiInfo{
				float: left;
				text-align: center;
				padding: 0px 0px 0px 12px;
			}
			
		</style>
		{% if results %}
			{% ifequal searchType "ta" %}
				<div id = "results">
					{% for result in results %}
						<div id="result">
							<div id="name">
								{{ result.firstName }} {{ result.lastName }} - {{ result.eid }}
							</div>
							<div id="basicInfo">
								<b>Phone:</b> {{ result.phone }}
								<br />
								<b>Email:</b> {{ result.email }}
								<br />
								<b>Major:</b> {{ result.major.name }} - {{ result.degree }}
								<br />
								<b>Native English:</b> {% if result.nativeEnglish %} Yes {% else %} No {% endif %}
								<br />
								<b>Supervising Professor:</b> {{ result.supervisor }}
							</div>
							<div class="multiInfo" id="specializations">
								{% if result.taSpecializations.count %}
									<b>Specializations:</b>
									<br />
									{% for taSpecialization in result.taSpecializations %}
										{{ taSpecialization.specialization.name }}
										<br />
									{% endfor %}
								{% endif %}
							</div>
							<div class="multiInfo" id="history">
								{% if result.taTaHistory.count %}
									<b>Previously TA'ed:</b>
									<br />
									{% for taHistory in result.taTaHistory %}
										{{ taHistory.taHistory.name }}
										<br />
									{% endfor %}
								{% endif %}
							</div>
							<div class="multiInfo" id="qualification">
								{% if result.taQualifications.count %}
									<b>Qualified for:</b>
									<br />
									{% for taQualification in result.taQualifications %}
										{{ taQualification.qualification.name }}
										<br />
									{% endfor %}
								{% endif %}
							</div>	
							<div class="multiInfo" id="assigned">
								{% if result.taSections.count %}
									<b>Assigned to:</b>
									<br />
									{% for taSection in result.taSections %}
										{{ taSection.section.uniqueNumber }} - {{ taSection.section.course.name }}
										<br />
									{% endfor %}
								{% endif %}
							</div>
							<div class="multiInfo" id="languages">
								{% if result.taLanguages.count %}
									<b>Languages:</b>
									<br />
									{% for taLanguage in result.taLanguages %}
										{{ taLanguage.language.name }}
										<br />
									{% endfor %}
								{% endif %}
							</div>
						</div>
					{% endfor %}	
				</div>
			{% else %}
				<div id="results">
					{% for result in results %}
						<div id="result" style="width:400px">
							<div id="name">
								{{ result.uniqueNumber }} - {{ result.course.name }}
							</div>
							<div id="basicInfo">
								<b>Instructor:</b> {{ result.instructor.firstName }} {{ result.instructor.lastName }}
								<br />
								<b>TAs Needed:</b> {{result.numTas}}
								<br />
								<b>Number of Students</b> {{ result.numStudents }}
								<br />
								{% if result.taSections.count %}
									<b>Assigned TAs:</b>
									<br />
									<div id="classAssigned">
										{% for taSection in result.taSections %}
											{{ taSection.ta.firstName }} {{ taSection.ta.lastName }}
											<br />
										{% endfor %}
									</div>
								{% endif %}
							</div>
						</div>
					{% endfor %}
				</div>
			{% endifequal %}
		{% else %}
			{{message}}
		{% endif %}
	</body>
</html>